import React from 'react'
// import { FormEvent } from 'react'

const apiUrl = process.env.REACT_APP_API_URL

export const LoginScreen = () => {
    const login = (param:{username:string, password:string}) => {
        fetch(`${apiUrl}/login`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(param)
        }).then(async (response:Response) => {
            if (response.ok) {
                
            }
        })
    }

    // @ts-ignore
    const handleSubmit = (event: React.FormEvent) => {  
        console.log(event)
        event.preventDefault()
        const username = (event.currentTarget.elements[0] as HTMLInputElement).value
        const password = (event.currentTarget.elements[1] as HTMLInputElement).value
        login({username, password})
    }

    return <form onSubmit={(e) => handleSubmit(e)}>
        <div>
            <label>用户名</label>
            <input type='text' id={'username'} />
        </div>
        <div>
            <label>密码</label>
            <input type='password' id={'password'} />
        </div>
        <button type='submit'>登录</button>
    </form>
}